<!-- 分享弹出组件 -->
<template>
	<view style="z-index: 9999;" class='mask' @click="hide" v-if='showMenu'>
		<view class="menuBox" :class="{show:showClass}">
			<view class="menuList flex-box align-center spaceAround">
				<view class="share" v-for="(item,index) in list" :key='index' @click="share(item.type)">
					<view class="iconBox flex-box align-center" :style="{background:item.color}">
						<!-- <text class="iconfont" :class="item.icon"></text> -->
						<image :src="item.image" mode=""></image>
					</view>
					<view class="textCenter thmeTxt">{{item.txt}}</view>
				
				</view>
			</view>
			<view class="cancel color666">取消</view>
		</view>
	</view>
</template>
<script>
	export default {
		props:['shareType','shareId'],
		data() {
			return {
				list:[
					{type:1,image:"/static/images/weixin.png",txt:'微信'},
					{type:2,image:"/static/images/pengyouquan.png",txt:'朋友圈'},
					{type:3,image:"/static/images/QQ.png",txt:'QQ'},
					{type:4,image:"/static/images/weibo.png",txt:'微博'}
				],
				showMenu:false,
				showClass: false,
				vid:uni.getStorageSync("vid"),
				url:""
			};
		},
		created() {
			console.log(this.shareType)
			console.log(this.shareId)
			// 1首页海报图 2商品海报图 3单商品活动海报图 4团购邀请海报 5分销邀请海报 6商品视频海报 7.单商品团购活动 8.多商品首页活动
			let url = "pages/index/index?vid=" + this.vid + '&pagetype='
			this.url = url
			if(this.shareType==1){ 
				url+=0
			}
			if(this.shareType==2){
				url=url+'1&gid='+this.shareId
			}
			if(this.shareType==3){
				url+=7
			}
			if(this.shareType==4){
				url = url+'3&gid='+this.shareId
			}
			if(this.shareType==5){  //分销
			   url+=10
			}
			if(this.shareType==6){
				url+=6
			}
			if(this.shareType==7){
				url+=8
			}
			if(this.shareType==8){
				url+=9
			}
			var that = this;
			that.showMenu = true
			setTimeout(function(){
				that.showClass = true
			},10)
		},
		methods:{
			hide(){
				var that = this;
				that.showClass = false;
				setTimeout(function(){
					that.showMenu = false;
				},300)
				that.$emit('show',false)
			},
			share(type){
				let that = this
				let shareData = uni.getStorageSync('shareData');
				if(type == 1 ){ // 微信
					uni.share({
					    provider: "weixin",
					    scene: "WXSceneSession",
					    type: 0,
					    href: that.url,
					    title: shareData.title,
					    summary: shareData.desc,
					    imageUrl:shareData.imageUrl,
					    success: function (res) {
					    },
					    fail: function (err) {
					       
					    }
					});
				}
				if(type == 2){ // 朋友圈
					uni.share({
					    provider: "weixin",
					    scene: "WXSenceTimeline",
					    type: 0,
					    href: that.url,
					    title: shareData.title,
					    summary: shareData.desc,
					    imageUrl:shareData.imageUrl,
					    success: function (res) {  
					    },
					    fail: function (err) {
					       
					    }
					});
				}
				if(type == 3){ // QQ
					uni.share({
					    provider: "qq",
					    type: 0,
					    href: that.url,
					    title: shareData.title,
					    summary: shareData.desc,
					    imageUrl:shareData.imageUrl,
					    success: function (res) {
					        
					    },
					    fail: function (err) {
					       
					    }
					});
				}
				if(type == 4){ // 微博
					uni.share({
					    provider: "sinaweibo",
					    type: 0,
					    href: that.url,
					    title: shareData.title,
					    summary: shareData.desc,
					    imageUrl:shareData.imageUrl,
					    success: function (res) {
					        
					    },
					    fail: function (err) {
					       
					    }
					});
				}
			}
		}
	}
</script>

<style scoped lang="less">
	.mask{z-index: 111;}
	.menuBox{
		position: absolute;left: 0;right: 0;bottom: -330rpx;background-color: #FFFFFF;border-radius: 36rpx  36rpx 0 0;transition: all 0.3s;
		&.show{
			bottom: 0;
		}
		.menuList{
			height: 220rpx;
			display: flex;
			justify-content: space-around;
			.iconBox{
				width: 80rpx;height: 80rpx;border-radius: 50%;justify-content: center;margin-bottom: 10rpx;
				.iconfont{
					font-size: 48rpx;color: white;
				}
			}
			.share{
				text-align: center;
				
			}
		}
		.cancel{line-height: 80rpx;border-top: 1px solid #EEEEEE;text-align: center;}
	}
	
</style>
